<template>
    <div>
        <el-popover
                placement="down"
                width="400"
                trigger="click" v-model="wayBillForm" ref="update_wayBill_modal" style="position: relative">
            <el-form ref="form" :model="waybillList" label-width="200px" class="update-form">
                <el-form-item label="原始单号">
                    <el-input v-model="waybillList.originaldocumentnumber"></el-input>
                </el-form-item>

                <el-form-item label="运单号">
                    <el-input v-model="waybillList.shippingnotenumber"></el-input>
                </el-form-item>

                <el-form-item label="分段分单号">
                    <el-input v-model="waybillList.serialnumber"></el-input>
                </el-form-item>

                <el-form-item label="运输总车辆数">
                    <el-input v-model="waybillList.vehicleamount"></el-input>
                </el-form-item>

                <el-form-item label="运输组织类型代码">
                    <el-input v-model="waybillList.transporttypecode"></el-input>
                </el-form-item>

                <el-form-item label="运单上传时间">
                    <el-input v-model="waybillList.sendtoprodatetime" disabled></el-input>
                </el-form-item>

                <el-form-item label="网络货运经营者名称">
                    <el-input v-model="waybillList.carrier"></el-input>
                </el-form-item>

                <el-form-item label="统一社会信用代码">
                    <el-input v-model="waybillList.unifiedsocialcreditidentifier"></el-input>
                </el-form-item>

                <el-form-item label="道路运输经营许可证编号">
                    <el-input v-model="waybillList.permitnumber"></el-input>
                </el-form-item>

                <el-form-item label="运单生成时间">
                    <el-input v-model="waybillList.consignmentdatetime"></el-input>
                </el-form-item>

                <el-form-item label="业务类型代码">
                    <el-input v-model="waybillList.businesstypecode"></el-input>
                </el-form-item>

                <el-form-item label="发货日期时间">
                    <el-input v-model="waybillList.despatchactualdatetime"></el-input>
                </el-form-item>

                <el-form-item label="收货日期时间">
                    <el-input v-model="waybillList.goodsreceiptdatetime"></el-input>
                </el-form-item>

                <el-form-item label="运费金额">
                    <el-input v-model="waybillList.totalmonetaryamount"></el-input>
                </el-form-item>
                托运人信息：
                <el-form-item label="托运人名称">
                    <el-input v-model="waybillList.consignorinfo.consignor"></el-input>
                </el-form-item>

                <el-form-item label="托运人统一社会信用代码或个人证件号">
                    <el-input v-model="waybillList.consignorinfo.consignorid"></el-input>
                </el-form-item>
                <el-form-item label="装货地址">
                    <el-input v-model="waybillList.consignorinfo.placeofloading"></el-input>
                </el-form-item>

                <el-form-item label="装货地点的国家行政区划代码或国别代码">
                    <el-input v-model="waybillList.consignorinfo.countrysubdivisioncode"></el-input>
                </el-form-item>

                收货方信息：
                <el-form-item label="收货方名称">
                    <el-input v-model="waybillList.consigneeinfo.consignee"></el-input>
                </el-form-item>

                <el-form-item label="收货方统一社会信用代码或个人证件号码">
                    <el-input v-model="waybillList.consigneeinfo.consigneeid"></el-input>
                </el-form-item>

                <el-form-item label="收货地址">
                    <el-input v-model="waybillList.consigneeinfo.goodsreceiptplace"></el-input>
                </el-form-item>

                <el-form-item label="收货地点的国家行政区划代码或国别代码">
                    <el-input v-model="waybillList.consigneeinfo.countrysubdivisioncode"></el-input>
                </el-form-item>
                price：
                <el-form-item label="总金额">
                    <el-input v-model="waybillList.priceinfo.totalmonetaryamount"></el-input>
                </el-form-item>

                <el-form-item label="币种">
                    <el-input v-model="waybillList.priceinfo.remark"></el-input>
                </el-form-item>
                车辆信息：
                <el-form-item label="车牌颜色代码">
                    <el-input v-model="waybillList.vehicleinfo.vehicleplatecolorcode"></el-input>
                </el-form-item>

                <el-form-item label="车辆牌照号">
                    <el-input v-model="waybillList.vehicleinfo.vehiclenumber"></el-input>
                </el-form-item>

                <el-form-item label="发货日期时间">
                    <el-input v-model="waybillList.vehicleinfo.despatchactualdatetime"></el-input>
                </el-form-item>

                <el-form-item label="收货日期时间">
                    <el-input v-model="waybillList.vehicleinfo.goodsreceiptdatetime"></el-input>
                </el-form-item>

                <el-form-item label="装货地址">
                    <el-input v-model="waybillList.vehicleinfo.placeofloading"></el-input>
                </el-form-item>

                <el-form-item label="收货地址">
                    <el-input v-model="waybillList.vehicleinfo.goodsreceiptplace"></el-input>
                </el-form-item>

                <el-form-item label="装货地址的国家行政区划代码或国别代码">
                    <el-input v-model="waybillList.vehicleinfo.loadingcountrysubdivisioncode"></el-input>
                </el-form-item>
                <el-form-item label="收货地址的国家行政区划代码或国别代码">
                    <el-input v-model="waybillList.vehicleinfo.receiptcountrysubdivisioncode"></el-input>
                </el-form-item>
                车辆信息-驾驶员：
                <el-form-item label="姓名">
                    <el-input v-model="waybillList.vehicleinfo.driver.drivername"></el-input>
                </el-form-item>
                <el-form-item label="身份证号">
                    <el-input v-model="waybillList.vehicleinfo.driver.drivinglicense"></el-input>
                </el-form-item>
                车辆信息-货物信息：
                <el-form-item label="货物名称">
                    <el-input v-model="waybillList.vehicleinfo.goodsinfo.descriptionofgoods"></el-input>
                </el-form-item>

                <el-form-item label="货物类型 分类代码">
                    <el-input v-model="waybillList.vehicleinfo.goodsinfo.cargotypeclassificationcode"></el-input>
                </el-form-item>
                <el-form-item label="货物项毛重">
                    <el-input v-model="waybillList.vehicleinfo.goodsinfo.goodsitemgrossweight"></el-input>
                </el-form-item>
                <el-form-item label="体积">
                    <el-input v-model="waybillList.vehicleinfo.goodsinfo.cube"></el-input>
                </el-form-item>
                <el-form-item label="总件数">
                    <el-input v-model="waybillList.vehicleinfo.goodsinfo.totalnumberofpackages"></el-input>
                </el-form-item>

                实际承运人信息：
                <el-form-item label="实际承运人名称">
                    <el-input v-model="waybillList.actualcarrierinfo.actualcarriername"></el-input>
                </el-form-item>
                <el-form-item label="实际承运人道路运输经营许可证号">
                    <el-input v-model="waybillList.actualcarrierinfo.actualcarrierbusinesslicense"></el-input>
                </el-form-item>
                <el-form-item label="实际承运人统一社会信用代码或证件号码">
                    <el-input v-model="waybillList.actualcarrierinfo.actualcarrierid"></el-input>
                </el-form-item>

                保险信息:
                <el-form-item label="保险单号">
                    <el-input v-model="waybillList.insuranceinformation.policynumber"></el-input>
                </el-form-item>
                <el-form-item label="保险公司 代码">
                    <el-input v-model="waybillList.insuranceinformation.insurancecompanycode"></el-input>
                </el-form-item>
                <el-form-item label="remark">
                    <el-input v-model="waybillList.remark"></el-input>
                </el-form-item>
                <el-form-item label="freetext">
                    <el-input v-model="waybillList.freetext"></el-input>
                </el-form-item>
                <el-form-item label="appkey">
                    <el-input v-model="waybillList.appkey"></el-input>
                </el-form-item>
                <el-form-item>
                    <el-button type="primary" @click="onSubmit('wayBillForm')">立即创建</el-button>
                    <el-button @click="hideForm('wayBillForm')">取消</el-button>
                </el-form-item>
            </el-form>
            <el-button slot="reference">上传电子运单</el-button>
        </el-popover>
    </div>
</template>

<script>
    export default {
        name: "wayBill",
        data(){
            return {
                wayBillForm: false,
                waybillList: {
                    originaldocumentnumber: 'YD19071300002', //原始单号
                    shippingnotenumber: 'YD19102600043', //运单号
                    serialnumber: '0000',   //分段分单号
                    vehicleamount: '1',  //运输总车辆数，同一运单号的货物总共使用的的运输车辆总数
                    transporttypecode: '1',  //运输组织类型代码
                    sendtoprodatetime: '###TIME###',  //运单上传时间
                    carrier: '营口港通电子商务有限公司',    //网络货运 经营者名称
                    unifiedsocialcreditidentifier: '91210800MA0QCJWM16',  //统一社会 信用代码
                    permitnumber: '210804203217',   //道路运输 经营许可证 编号
                    consignmentdatetime: '20200518090922',    //运单生成时间
                    businesstypecode: '1003997',   //业务类型代码
                    despatchactualdatetime: '20200519144210', //发货日期时间
                    goodsreceiptdatetime: '20200521074210',   //收货日期时间
                    totalmonetaryamount: '999.999',    //运费金额
                    consignorinfo: {    //托运人信息
                        consignor: '营口钢铁有限公司',  //托运人名称
                        consignorid: '91210800564625567P',    //托运人统一社会信用代码或个人证件号
                        placeofloading: '辽宁省营口市鲅鱼圈区营港路7号', //装货地址
                        countrysubdivisioncode: '210804', //装货地点的国家行政区划代码或国别代码
                    },
                    consigneeinfo: {    //收货方信息
                        consignee: '曹亚红',  //收货方名称
                        consigneeid: '210321197110251636',    //收货方统一社会信用代码或个人证件号码
                        goodsreceiptplace: '辽宁省营口市鲅鱼圈区营港路1号',  //收货地址
                        countrysubdivisioncode: '210804', //收货地点的国家行政区划代码或国别代码
                    },
                    priceinfo: {    //资金信息
                        totalmonetaryamount: '999.999',    //总金额
                        remark: '人民币', // 币种
                    },  //
                    vehicleinfo: {  //车辆信息
                        vehicleplatecolorcode: '2',  //车牌颜色代码
                        vehiclenumber: '辽H78747',  //车辆牌照号
                        despatchactualdatetime: '20200520144210', //发货日期时间
                        goodsreceiptdatetime: '20200521074210',   //收货日期时间
                        placeofloading: '', //装货地址
                        goodsreceiptplace: '辽宁省营口市鲅鱼圈区营港路1号',  //收货地址
                        loadingcountrysubdivisioncode: '',  //装货地址的国家行政区划代码或国别代码
                        receiptcountrysubdivisioncode: '',  //收货地址的国家行政区划代码或国别代码
                        driver: {   //驾驶员
                            drivername: '李广俊', //姓名
                            drivinglicense: '210423197605212813', //身份证号
                        },
                        goodsinfo: {    //货物信息
                            descriptionofgoods: '海草', //货物名称
                            cargotypeclassificationcode: '0100',    //货物类型 分类代码
                            goodsitemgrossweight: '23000.000',   //货物项毛重
                            cube: '1.5000',   //体积
                            totalnumberofpackages: '1',  //总件数
                        }   //
                    },  //
                    actualcarrierinfo: {    //实际承运人信息
                        actualcarriername: '营口瑞盈物流有限公司（张三）',  //实际承运人名称
                        actualcarrierbusinesslicense: '210804203625',   //实际承运人道路运输经营许可证号
                        actualcarrierid: '91210804MA0UWKXB3C' //实际承运人统一社会信用代码或证件号码
                    },
                    insuranceinformation: { //保险信息
                        policynumber: '6000100000000000000',   //保险单号
                        insurancecompanycode: 'QITA',   //保险公司 代码
                    },
                    remark: '', //
                    freetext: '',   //
                    appkey: '13762'  //
                }
            }
        },
        methods: {
            defaultWaybill() {
                return `
    <reqInfo>
<root>
<header>
<messagereferencenumber>###UUID###</messagereferencenumber>
<documentname>电子运单</documentname>
<documentversionnumber>2.0</documentversionnumber>
<sendercode>210000</sendercode>
<enterprisesendercode>2113762</enterprisesendercode>
<messagesendingdatetime>###TIME###</messagesendingdatetime>
<ipctype>WLHY_YD1001</ipctype>
<token>427690567060f4d98f24c10099fcaa98</token>
<messagefunctioncode>9</messagefunctioncode>
<recipientcode>wcjc0002</recipientcode>
</header>
`
            },
            onSubmit(formName){
                this.hideForm(formName)
                let header = this.defaultWaybill()
                let str = `
                    ${header}<body>
						<originaldocumentnumber>${this.waybillList.originaldocumentnumber}</originaldocumentnumber>
						<shippingnotenumber>${this.waybillList.shippingnotenumber}</shippingnotenumber>
						<serialnumber>${this.waybillList.serialnumber}</serialnumber>
						<vehicleamount>${this.waybillList.vehicleamount}</vehicleamount>
						<transporttypecode>${this.waybillList.transporttypecode}</transporttypecode>
						<sendtoprodatetime>${this.waybillList.sendtoprodatetime}</sendtoprodatetime>
						<carrier>${this.waybillList.carrier}</carrier>
						<unifiedsocialcreditidentifier>${this.waybillList.unifiedsocialcreditidentifier}</unifiedsocialcreditidentifier>
						<permitnumber>${this.waybillList.permitnumber}</permitnumber>
						<consignmentdatetime>${this.waybillList.consignmentdatetime}</consignmentdatetime>
						<businesstypecode>${this.waybillList.businesstypecode}</businesstypecode>
						<despatchactualdatetime>${this.waybillList.despatchactualdatetime}</despatchactualdatetime>
						<goodsreceiptdatetime>${this.waybillList.goodsreceiptdatetime}</goodsreceiptdatetime>
						<totalmonetaryamount>${this.waybillList.totalmonetaryamount}</totalmonetaryamount>
						<consignorinfo>
							<consignor>${this.waybillList.consignorinfo.consignor}</consignor>
							<consignorid>${this.waybillList.consignorinfo.consignorid}</consignorid>
							<placeofloading>${this.waybillList.consignorinfo.placeofloading}</placeofloading>
							<countrysubdivisioncode>${this.waybillList.consignorinfo.countrysubdivisioncode}</countrysubdivisioncode>
						</consignorinfo>
						<consigneeinfo>
						       <consignee>${this.waybillList.consigneeinfo.consignee}</consignee>
						       <consigneeid>${this.waybillList.consigneeinfo.consigneeid}</consigneeid>
						       <goodsreceiptplace>${this.waybillList.consigneeinfo.goodsreceiptplace}</goodsreceiptplace>
						       <countrysubdivisioncode>${this.waybillList.consigneeinfo.countrysubdivisioncode}</countrysubdivisioncode>
					      </consigneeinfo>
						<priceinfo>
							<totalmonetaryamount>${this.waybillList.priceinfo.totalmonetaryamount}</totalmonetaryamount>
							<remark>${this.waybillList.priceinfo.remark}</remark>
						</priceinfo>
						<vehicleinfo>
							<vehicleplatecolorcode>${this.waybillList.vehicleinfo.vehicleplatecolorcode}</vehicleplatecolorcode>
							<vehiclenumber>${this.waybillList.vehicleinfo.vehiclenumber}</vehiclenumber>
							<despatchactualdatetime>${this.waybillList.vehicleinfo.despatchactualdatetime}</despatchactualdatetime>
							<goodsreceiptdatetime>${this.waybillList.vehicleinfo.goodsreceiptdatetime}</goodsreceiptdatetime>
							<placeofloading/>
							<goodsreceiptplace>${this.waybillList.vehicleinfo.goodsreceiptplace}</goodsreceiptplace>
							<loadingcountrysubdivisioncode/>
							<receiptcountrysubdivisioncode/>
							<driver>
								<drivername>${this.waybillList.vehicleinfo.driver.drivername}</drivername>
								<drivinglicense>${this.waybillList.vehicleinfo.driver.drivinglicense}</drivinglicense>
							</driver>
							<goodsinfo>
								<descriptionofgoods>${this.waybillList.vehicleinfo.goodsinfo.descriptionofgoods}</descriptionofgoods>
								<cargotypeclassificationcode>${this.waybillList.vehicleinfo.goodsinfo.cargotypeclassificationcode}</cargotypeclassificationcode>
								<goodsitemgrossweight>${this.waybillList.vehicleinfo.goodsinfo.goodsitemgrossweight}</goodsitemgrossweight>
								<cube>${this.waybillList.vehicleinfo.goodsinfo.cube}</cube>
								<totalnumberofpackages>${this.waybillList.vehicleinfo.goodsinfo.totalnumberofpackages}</totalnumberofpackages>
							</goodsinfo>
						</vehicleinfo>
						<actualcarrierinfo>
							<actualcarriername>${this.waybillList.actualcarrierinfo.actualcarriername}</actualcarriername>
							<actualcarrierbusinesslicense>${this.waybillList.actualcarrierinfo.actualcarrierbusinesslicense}</actualcarrierbusinesslicense>
							<actualcarrierid>${this.waybillList.actualcarrierinfo.actualcarrierid}</actualcarrierid>
						</actualcarrierinfo>
						<insuranceinformation>
							<policynumber>${this.waybillList.insuranceinformation.policynumber}</policynumber>
							<insurancecompanycode>${this.waybillList.insuranceinformation.insurancecompanycode}</insurancecompanycode>
						 </insuranceinformation>
                    <remark>${this.waybillList.remark}</remark>
                    <freetext>${this.waybillList.freetext}</freetext>
                    <appkey>${this.waybillList.appkey}</appkey>
                    </body>
                    </root>
                    </reqInfo>
                `
                console.log(str);
                this.cusMark()
                this.api.dataPost.wayBillInfo(str).then((res) => {
                    console.log(res);
                    this.handleRes(res)
                }).catch((err) => {
                    console.log(err);
                })
            }
        },
        mounted() {
        }
    }
</script>

<style scoped>

</style>